<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        
    </h:head>
    <h:body style="background-color: background;">
        
        <h:form id="frmUser">
            
                
            <p:panelGrid columns="8" style=" max-width: 85%;margin-top: 2%; margin-left: auto ; margin-right: auto;">
    
        <p:outputLabel value="Logged User: #{userBean.name}" />
        
        <p:commandLink  action="#{calendarBean.home()}" value="Home"/>
        <p:commandLink  action="#{calendarBean.invitation()}" value="invitation"/>
        <p:commandLink  action="#{calendarBean.notification()}" value="notification"/>
        <p:commandLink  action="#{calendarBean.favorite()}" value="favorite"/>
        
        <h:panelGrid columns="3" style="max-width: fit-content" >
            <h:outputLabel for="searchUsr" value="Search User: " />
            <p:autoComplete id="autoUser" value="#{autoCompleteUsers.searched}" completeMethod="#{autoCompleteUsers.completeText}" forceSelection="true"/>
            <p:commandButton id="cmdSubmit" value="Submit" icon="ui-icon-check" action="#{autoCompleteUsers.visitUser}" update="messages" />
        </h:panelGrid>
        
        <h:panelGrid columns="3" style="max-width: fit-content">
            <h:outputLabel for="searchEvt" value="Search Event: " />
            <p:autoComplete id="autoEvent" value="#{autoCompleteEvent.searched}" completeMethod="#{autoCompleteEvent.completeText}" forceSelection="true"/>
            <p:commandButton id="cmdSubmitEvent" value="Submit" icon="ui-icon-check" action="#{autoCompleteEvent.visitEvent}" update="messages" />
        </h:panelGrid>
        
        <p:commandLink  action="#{loginBean.logout()}" value="logout"/>
    </p:panelGrid>
            
    <p:messages id="messages" autoUpdate="true" globalOnly="true" showDetail="true" />
    
    <h:panelGrid columns="2" style="margin-top:4%; margin-left: auto; margin-right: auto;">
        
        
        
    <p:panelGrid id="pnlInfo" columns="1" style="text-align: center; margin-left: 3%; margin-right: 10%"  rendered="#{not empty otherUser.user.email}">
        <h:panelGrid columns="2">
            <h:outputLabel value="Email: "/>
            <h:outputLabel value="#{otherUser.user.email}" />
            <h:outputLabel value="Name: "/>
            <h:outputLabel value="#{otherUser.user.name}" />
            <h:outputLabel value="Surname: "/>
            <h:outputLabel value="#{otherUser.user.surname}" />
            <h:outputLabel value="City: "/>
            <h:outputLabel value="#{otherUser.user.city}" />
        </h:panelGrid>
            
        <h:outputLabel rendered="#{not otherUser.visible}" value="This User sets his calendar to private"/>
        
        <h:panelGrid id="pnlAddRemove" columns="1" rendered="#{not otherUser.sameUser()}">
            <p:commandButton id="addButton" value="Add to Favorite" rendered="#{not otherUser.isFavorite()}" actionListener="#{otherUser.addToFavorite}" update="pnlAddRemove" />
            <p:commandButton id="removeButton" value="Remove Favorite" rendered="#{otherUser.isFavorite()}"  actionListener="#{otherUser.removeFromFavorite}" update="pnlAddRemove" />
        </h:panelGrid>
    </p:panelGrid>
    
        <h:panelGrid columnClasses="value" style="margin-left: auto; margin-right: auto;">
        
        <p:schedule id="usrSchedule" value="#{otherUser.eventModel}" rendered="#{otherUser.visible}" widgetVar="otherSchedule" draggable="false" timeZone="GMT+1">
 
            <p:ajax event="eventSelect" listener="#{calendarBean.onEventSelect}" update="eventDetails" oncomplete="PF('eventDialog').show();" />
 
        </p:schedule>
    </h:panelGrid>
    </h:panelGrid>
    
    <p:dialog widgetVar="eventDialog" header="Event Details" showEffect="clip" hideEffect="clip">
        <h:panelGrid id="eventDetails" columns="2">
            
            <h:outputLabel for="title" value="Title:" />
            <h:outputLabel value="#{otherUser.event.title}"  />
            
            <h:outputLabel for="place" value="Place:" />
            <h:outputLabel value="#{otherUser.event.place}"  />
            
            <h:outputLabel for="from" value="From:" />
            <h:outputLabel id="from" value="#{calendarBean.event.startDate}"  >
                <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="GMT+1" />
            </h:outputLabel>
 
            <h:outputLabel for="to" value="To:" />
            <h:outputLabel id="to" value="#{calendarBean.event.endDate}"  >
                <f:convertDateTime pattern="dd/MM/yyyy HH:mm:ss" timeZone="GMT+1" />
            </h:outputLabel>
            
            <h:outputLabel for="Public" value="Public:"  />
            <h:selectBooleanCheckbox id="public" value="#{calendarBean.event.visible}" readonly="true" />
            
        </h:panelGrid>
    </p:dialog>  
    
    
</h:form>
 
<style type="text/css">
    .value {
        width: 1000px;
    }
</style>
    </h:body>
</html>

